import React, { Component } from "react";
export default class Son extends Component {
    constructor(props) {
        super(props)
        console.log(this.props)
    }
    state = {
        flag: false
    }
    componentWillUnmount() {
        console.log("son-componentWillUnMount")
    }
    // 只要父组件动了需要传过来的值就会触发该钩子函数
    componentWillReceiveProps({ num }, b) {
        if (this.props.num == num) return
        console.log(num, 'componentWillReceiveProps-a');
        console.log(b, "componentWillReceiveProps-b")
        console.log("son-componentWillPeceiveProps")
    }
    // 该钩子函数必须有返回值return  true或false  true继续往下执行，false则返回
    shouldComponentUpdate({ num }, b) {
        console.log(num, "shouldComponentUpdate-a")
        console.log(b, "shouldComponentUpdate-b")
        console.log("son-shouldComponentUpdate")
        if (this.props.num == num) {
            return false
        } else {
            return true
        }
    }
    componentWillUpdate() {
        console.log("son-componentWillUpdate")
    }
    isFlag = () => {
        this.setState({
            flag: !this.state.flag
        })
    }
    render() {
        console.log("son-render")
        return (
            <div>
                <h1>Son组件</h1>
                <input type="text" ref="inp" />
                <button onClick={this.isFlag}>子组件改变状态</button>
            </div>
        )
    }
    componentDidMount() {
        this.refs.inp.focus()
    }
    componentDidUpdate() {
        console.log("son-componentDidUpdate")
    }
}